<div class="layui-fluid layui-anim febs-anim" id="businesses-grouping" lay-title="分组">
    <div class="layui-row febs-container">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-body febs-table-full">
                    <form class="layui-form layui-table-form" lay-filter="grouping-table-form">
                        <fieldset class="layui-elem-field layui-field-title" style="margin-top: 10px;">
                            <legend style="font-size: 15px; font-weight: bolder;">批量查询</legend>
                        </fieldset>
                        <div class="layui-row">
                            <div class="layui-col-md12">
                                <div class="layui-form-item">
                                    <div class="layui-inline">
                                        <label class="layui-form-label layui-form-label-sm">批次</label>
                                        <div class="layui-input-inline">
                                            <select name="batchId" id="cboGroupingBatch" lay-filter="cboGroupingBatch">
                                                <option value=""></option>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="layui-inline">
                                        <label class="layui-form-label layui-form-label-sm">院校</label>
                                        <div class="layui-input-inline">
                                            <select name="collegeId" id="cboGroupingCollege" lay-search=""
                                                    lay-filter="cboGroupingCollege">
                                                <option value=""></option>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="layui-inline">
                                        <label class="layui-form-label layui-form-label-sm">层次</label>
                                        <div class="layui-input-inline">
                                            <select name="level" id="cboGroupingLevel" lay-filter="cboGroupingLevel">
                                                <option value=""></option>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="layui-inline">
                                        <label class="layui-form-label layui-form-label-sm">专业</label>
                                        <div class="layui-input-inline">
                                            <select name="majorId" id="cboGroupingMajor" lay-search=""
                                                    lay-filter="cboGroupingMajor">
                                                <option value=""></option>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="layui-inline">
                                        <label class="layui-form-label layui-form-label-sm">招生老师</label>
                                        <div class="layui-input-inline">
                                            <input type="text" name="userId" id="txtGroupingTeacher"
                                                   lay-filter="txtGroupingTeacher" class="layui-input">
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <fieldset class="layui-elem-field layui-field-title" style="margin-top: 10px;">
                            <legend style="font-size: 15px; font-weight: bolder;">精确查询</legend>
                        </fieldset>
                        <div class="layui-row">
                            <div class="layui-col-md10">
                                <div class="layui-form-item">
                                    <div class="layui-inline">
                                        <label class="layui-form-label layui-form-label-sm">姓名</label>
                                        <div class="layui-input-inline">
                                            <input type="text" name="stuName" autocomplete="off" class="layui-input"
                                                   lay-verify="txt" maxlength="10">
                                        </div>
                                    </div>
                                    <div class="layui-inline">
                                        <label class="layui-form-label layui-form-label-sm">身份证号</label>
                                        <div class="layui-input-inline">
                                            <input type="text" name="identity" autocomplete="off" class="layui-input"
                                                   lay-verify="dimIdentity" maxlength="18">
                                        </div>
                                    </div>
                                    <div class="layui-inline">
                                        <label class="layui-form-label layui-form-label-sm">手机号</label>
                                        <div class="layui-input-inline">
                                            <input type="text" name="tel" autocomplete="off" class="layui-input"
                                                   lay-verify="number" maxlength="11">
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="layui-col-md2 layui-col-sm12 layui-col-xs12 table-action-area">
                                <div class="layui-btn layui-btn-sm layui-btn-primary febs-button-blue-plain table-action"
                                     id="groupingQuery">
                                    <i class="layui-icon">&#xe848;</i>
                                </div>
                                <div class="layui-btn layui-btn-sm layui-btn-primary febs-button-green-plain table-action"
                                     id="groupingReset">
                                    <i class="layui-icon">&#xe79b;</i>
                                </div>
                            </div>
                        </div>
                    </form>
                    <blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px;">
                        <div class="layui-row layui-form">
                            <div class="layui-inline">
                                <label class="layui-form-label layui-form-label-sm">学生组</label>
                                <div class="layui-input-inline">
                                    <select name="groupId" id="cboGroupingStudentGroup" lay-search="">
                                        <option value=""></option>
                                    </select>
                                </div>
                            </div>
                            <input type="hidden" id="hidGroupingGroupId" data-th-value="${id}">
                            <div class="layui-btn layui-btn-sm layui-btn-primary febs-button-blue-plain table-action"
                                 id="groupingSelected">
                                <i class="layui-icon">所选学生</i>
                            </div>
                            <div class="layui-btn layui-btn-sm layui-btn-primary febs-button-blue-plain table-action"
                                 id="groupingCurrPage">
                                <i class="layui-icon">本页所有</i>
                            </div>
                            <div class="layui-btn layui-btn-sm layui-btn-primary febs-button-blue-plain table-action"
                                 id="groupingAllResult">
                                <i class="layui-icon">所有结果</i>
                            </div>
                            <div class="layui-btn layui-btn-sm layui-btn-primary febs-button-green-plain table-action"
                                 id="btnSynchornize">
                                <i class="layui-icon">&#xe797;EC同步</i>
                            </div>
                        </div>
                    </blockquote>
                    <table lay-filter="groupingStudentTable" lay-data="{id: 'groupingStudentTable'}"></table>
                </div>
            </div>
        </div>
    </div>
</div>
<script type="text/html" id="student-option">
    <a lay-event="groupingDetail" title="查看详情"><i class="layui-icon febs-edit-area febs-green">&#xe7a5;</i></a>
</script>
<script data-th-inline="none" type="text/javascript">
    layui.use(["treeSelect", 'jquery', 'form', 'table', 'febs'], function () {
        let $ = layui.jquery,
            febs = layui.febs,
            form = layui.form,
            treeSelect = layui.treeSelect,
            table = layui.table,
            $view = $('#businesses-grouping'),
            $query = $view.find('#groupingQuery'),
            $reset = $view.find('#groupingReset'),
            $searchForm = $view.find('form'),
            tableIns,
            $groupingSelected = $view.find('#groupingSelected'),
            $groupingCurrPage = $view.find('#groupingCurrPage'),
            $groupingAllResult = $view.find('#groupingAllResult');

        form.render();

        initTable();

        //招生老师-树形下拉框带搜索
        treeSelect.render({
            // 选择器
            elem: '#txtGroupingTeacher',
            // 数据
            data: ctx + 'transferApplication/userDeptTree',
            // 异步加载方式：get/post，默认get
            type: 'get',
            // 占位符
            placeholder: '请选择',
            // 是否开启搜索功能：true/false，默认false
            search: true,
            style: {
                folder: { // 父节点图标
                    enable: true // 是否开启：true/false
                },
                line: {
                    enable: true
                }
            },
            // 点击回调
            click: function (d) {
                $("#txtGroupingTeacher").val(d.current.id);
            },
            // 加载完成后的回调函数
            success: function (d) {
            }
        });

        //分组--所选学生
        $groupingSelected.on('click', function () {
            let checkStatus = table.checkStatus('groupingStudentTable');
            let groupId = $("#cboGroupingStudentGroup").val();
            if (!groupId) {
                febs.alert.warn('请先选择学生组');
                return false;
            }
            if (!checkStatus.data.length) {
                febs.alert.warn('请选择需要分组的学生');
            } else {
                febs.modal.confirm('提示', '确定将所选学生进行分组？', function () {
                    let studentIds = [];
                    layui.each(checkStatus.data, function (key, item) {
                        studentIds.push(item.id);
                    });
                    groupingStudent(studentIds.join(','), groupId);
                });
            }
        });
        //分组--本页全部
        $groupingCurrPage.on('click', function () {
            let checkStatus = table.checkStatus('groupingStudentTable');
            let groupId = $("#cboGroupingStudentGroup").val();
            if (!groupId) {
                febs.alert.warn('请先选择学生组');
                return false;
            }
            febs.modal.confirm('提示', '确定将当前页的学生进行分组？', function () {
                let data = table.cache["groupingStudentTable"];
                let studentIds = [];
                layui.each(data, function (key, item) {
                    studentIds.push(item.id);
                });
                groupingStudent(studentIds.join(','), groupId);
            });
        });
        //分组--所有结果
        $groupingAllResult.on('click', function () {
            let checkStatus = table.checkStatus('groupingStudentTable');
            let groupId = $("#cboGroupingStudentGroup").val();
            if (!groupId) {
                febs.alert.warn('请先选择学生组');
                return false;
            }
            febs.modal.confirm('提示', '确定将查询到的所有学生进行分组？', function () {
                let params = getQueryParams();
                febs.post(ctx + 'reqResultExtension/updateGroupIdAll?groupId=' + groupId, params, function () {
                    febs.alert.success('分组操作成功');
                    $query.click();
                });
            });
        });

        //学生组下拉菜单
        febs.get(ctx + 'group/select', null, function (data) {
            let list = data.data;
            for (let i = 0; i < list.length; i++) {
                if (list[i].id == $('#hidGroupingGroupId').val()) {
                    $("#cboGroupingStudentGroup").append(new Option(list[i].groupNo, list[i].id, true, true));
                } else {
                    $("#cboGroupingStudentGroup").append(new Option(list[i].groupNo, list[i].id));
                }
            }
            //重新渲染下拉菜单
            form.render("select");
        });

        $query.on('click', function () {
            let params = getQueryParams();
            tableIns.reload({where: params, page: {curr: 1}});
        });

        //文本框回车查询
        $(".layui-input").keyup(function (e) {
            if (e.which === 13) {
                $query.click();
            }
        });

        $reset.on('click', function () {
            $searchForm[0].reset();
            tableIns.reload({where: getQueryParams(true), page: {curr: 1}});
        });

        //学生详情
        table.on('tool(groupingStudentTable)', function (obj) {
            let data = obj.data,
                layEvent = obj.event;
            if (layEvent === 'groupingDetail') {
                febs.modal.view('学生详情', 'student/poolDetail/' + data.id, {
                    area: ['70%', '80%'],
                    tipsMore: true
                });
            }
        });

        function initTable() {
            tableIns = febs.table.init({
                elem: $view.find('table'),
                id: 'groupingStudentTable',
                url: ctx + 'reqResultExtension/groupingList',
                height: 300,
                cols: [[
                    {type: 'checkbox'},
                    {field: 'batchName', title: '批次', width: 80},
                    {field: 'collegeName', title: '院校', minWidth: 160},
                    {field: 'levelName', title: '层次', width: 80},
                    {field: 'majorName', title: '专业', minWidth: 100},
                    {field: 'userName', title: '招生老师', minWidth: 100},
                    {field: 'stuName', title: '姓名', minWidth: 100},
                    {field: 'address', title: '家庭住址', width: 150},
                    {field: 'identity', title: '身份证号', width: 180},
                    {field: 'tel', title: '手机号', width: 120},
                    {title: '操作', toolbar: '#student-option', width: 60}
                ]]
            });
        }

        function getQueryParams(flag) {
            let params = $searchForm.serializeJson();
            return params;
        }

        function groupingStudent(studentIds, groupId) {
            febs.post(ctx + 'reqResultExtension/updateGroupId/' + studentIds + '/' + groupId, null, function () {
                febs.alert.success('分组操作成功');
                $query.click();
            });
        }

        //查询所有有效批次
        febs.get(ctx + 'college/batchSelect', null, function (data) {
            let list = data.data;
            for (let i = 0; i < list.length; i++) {
                $("#cboGroupingBatch").append(new Option(list[i].batchName, list[i].id));
            }
            //重新渲染下拉菜单
            form.render("select");
        });

        //查询所有院校
        febs.get(ctx + 'college/collegeSelect', null, function (data) {
            let list = data.data;
            for (let i = 0; i < list.length; i++) {
                $("#cboGroupingCollege").append(new Option(list[i].name, list[i].id));
            }
            //重新渲染下拉菜单
            form.render("select");
        });

        //院校层次联动
        form.on('select(cboGroupingCollege)', function (data) {
            let collegeId = data.value;
            $("#cboGroupingLevel").empty();
            $("#cboGroupingLevel").append(new Option("", ""));
            $("#cboGroupingMajor").empty();
            $("#cboGroupingMajor").append(new Option("", ""));
            febs.get(ctx + 'college/levelSelect?collegeId=' + collegeId, null, function (data) {
                let list = data.data;
                for (let i = 0; i < list.length; i++) {
                    $("#cboGroupingLevel").append(new Option(list[i].levelName, list[i].id));
                }
                //重新渲染下拉菜单
                form.render("select");
            });
        })

        //院校层次专业联动
        form.on('select(cboGroupingLevel)', function (data) {
            let collegeId = $("#cboGroupingCollege").val();
            let levelId = data.value;
            $("#cboGroupingMajor").empty();
            $("#cboGroupingMajor").append(new Option("", ""));
            febs.get(ctx + 'college/majorSelect?collegeId=' + collegeId + "&levelId=" + levelId, null, function (data) {
                let list = data.data;
                for (let i = 0; i < list.length; i++) {
                    $("#cboGroupingMajor").append(new Option(list[i].fullName, list[i].id));
                }
                //重新渲染下拉菜单
                form.render("select");
            });
        })
    })
</script>